<style lang="less">
    @import '../../../styles/common.less';
</style>

<template>
    <div class="user-list">
        <Card>
            <p slot="title">
                <Icon type="mouse"></Icon>
                点击搜索进行搜索
            </p>
            <Row>
                <Input v-model="query.name" placeholder="请输入名称搜搜..." style="width: 200px"/>
                <span @click="handleSearch" style="margin: 0 10px;">
                    <Button type="primary" icon="search">搜索</Button>
                </span>

            </Row>
        </Card>
        <Card>
            <Row>
                <Table :columns="columns" :data="dataList" border></Table>
            </Row>
        </Card>
        <Card>
            <Row>
                <Page :current.sync="page.pageNumber"
                      :page-size="page.pageSize"
                      :total.sync="page.totalCount"
                      @on-change="handlePage"
                      @on-page-size-change='handlePageSize'
                      show-elevator show-sizer>
                </Page>
            </Row>
        </Card>

    </div>
</template>

<script>

    import groupRequest from '../../../app/api/core/group';
    import dictionary from '../../../app/common/lib/dictionary';
    import prompt from '@/libs/prompt';
    import permission from '../../../app/common/auth/permission';


    export default {
        name: 'group-list',
        data() {
            return {
                editVisible: false,
                addVisible: false,
                editId: '',
                query: {name: ''},
                columns: [
                    {
                        key: 'index',
                        title: '序号',
                        width: 70,
                        render: (h, params) => {
                            var index = params.index;
                            return h('div', [
                                h('label', {}, (index + 1))
                            ]);
                        }
                    },
                    {
                        key: 'name',
                        title: '群名'
                    },
                    {
                        key: 'number',
                        title: '群号'
                    },
                    {
                        key: 'flagName',
                        title: '有效标志'
                    },
                    {
                        key: 'createTime',
                        title: '创建时间'
                    }
                ],
                dataList: [],
                page: {
                    pageSize: 10,
                    pageNumber: 1,
                    totalCount: 0
                }
            };
        },
        components: {},
        methods: {
            init() {
                this.search();
            },
            handleSearch: function () {
                this.page.pageNumber = 1;
                this.search();
            },
            handleCancel() {
                this.data = this.initTable;
            },
            handlePage(value) {
                var own = this;
                own.page.pageNumber = value;
                this.search();
            },
            handlePageSize(value) {
                var own = this;
                own.page.pageSize = value;
                this.search();
            },
            search() {
                var own = this;
                var query = own.query;
                var page = own.page;

                groupRequest.list(query, page, function (data) {
                    if (data.body && data.body.list) {
                        var body = data.body;
                        var list = body.list;
                        dictionary.setName(list, 'common', 'flag', 'flagName');
                        own.dataList = list;
                    }
                    if (data.body && data.body.page) {
                        var body = data.body;
                        var page = body.page;
                        var totalCount = page.totalCount;
                        own.page.totalCount = totalCount;
                    }
                });

            },
            handleEditDone(edit, info, group) {
                if (info.success) {
                    this.editVisible = false;
                    this.handleSearch();
                    prompt.message(info, '保存成功。', '保存失败！');
                }

            },
            handleAddDone(edit, info, group) {
                if (info.success) {
                    this.addVisible = false;
                    this.search();
                    prompt.message(info, '保存成功。', '保存失败！');
                }
            }
        },
        mounted() {
            this.init();
        }
    };
</script>
